<template>
  <div class="companyInfo">
    <div id="container">
      <!-- <script src="style/js/swfobject_modified.js" type="text/javascript"></script> -->
      <div class="clearfix">
        <div class="content_l">
          <div class="c_detail">
            <div class="c_box companyName">
              <h2 :title="company_principal.company.title">{{company_principal.company.title}}</h2>

              <em :class="company_principal.company.companyAuth?'valid':'unvalid'"></em>
              <span class="va dn">半城直聘未认证企业</span>
              <a
                target="_blank"
                class="applyC"
                href="javascript:void(0)"
                v-if="!company_principal.company.companyAuth"
              >申请认证</a>
              <div class="clear"></div>

              <!-- <h1
                :title="company_principal.company.title"
                class="fullname"
              >{{company_principal.company.title}}</h1>-->
              <div class="clear oneword">
                <span>地址：{{company_principal.company.address}}</span>
              </div>
              <div class="clear oneword">
                <span>规模：{{scaleArr[Number(company_principal.company.scale) - 1]}}</span>
              </div>
            </div>
            <div class="clear"></div>
          </div>
          <div class="c_breakline"></div>
          <div id="Product">
            <div class="product_wrap">
              <!--有产品-->
              <dl class="c_product">
                <dt>
                  <h2>
                    <em></em>公司环境
                  </h2>
                </dt>
                <dd class="environment">
                  <el-carousel height="220px" :autoplay="false">
                    <el-carousel-item
                      v-for="(item,index) in company.image"
                      :key="index"
                      class="swiperItem"
                    >
                      <img style="height:100%" :src="item.image_url" />
                    </el-carousel-item>
                  </el-carousel>
                </dd>
              </dl>
            </div>
          </div>
          <!-- end #Product -->

          <div id="Profile">
            <div class="profile_wrap">
              <!--有介绍-->
              <dl class="c_section">
                <dt>
                  <h2>
                    <em></em>公司介绍
                  </h2>
                </dt>
                <dd>
                  <div class="c_intro">{{company_principal.company.description}}</div>
                </dd>
              </dl>
            </div>
          </div>
          <!-- end #Profile -->

          <!--无招聘职位-->
          <dl id="noJobs" class="c_section">
            <dt>
              <h2>
                <em></em>在招职位
              </h2>
            </dt>
            <dd>
              <div id="hotList">
                <ul class="hot_pos reset">
                  <li
                    v-for="(item,index) in company.job"
                    :key="index"
                    :class="'clearfix'+(index%2 == 0 ? ' odd':'')"
                    v-if="index < 5"
                  >
                    <div class="hot_pos_l">
                      <div class="mb10">
                        <a
                          href="javascript:void(0)"
                          target="_blank"
                        >{{item.job_title||item.position.position_title}}</a>
                        &nbsp;
                        <!-- <span class="c9">[北京]</span> -->
                      </div>
                      <span>{{item.salary_unit == 4?'面议':(item.salary_min ?(item.salary_min === item.salary_max ? item.salary_min : item.salary_min + '-' + item.salary_max):item.salary)}}{{salary_unit[item.salary_unit]}}</span>
                      <span>
                        <em class="c7">经验：</em>
                        {{(item.job_experience_min == item.job_experience_max == 0)?'经验不限':(item.job_experience_min - item.job_experience_max+'年')}}
                      </span>
                      <span>
                        <em class="c7">最低学历：</em>
                        {{educationArr[Number(item.job_education)]}}
                      </span>
                      <br />
                      <span>发布时间：{{item.time_update}}</span>
                      <br />
                      <!-- <ul class="companyTags reset">
                        <li>五险一金</li>
                        <li>福利好</li>
                        <li>商业险</li>
                      </ul>-->
                    </div>
                    <div class="hot_pos_r"></div>
                  </li>
                  <li v-if="company.job.length == 0">暂无招聘职位</li>
                  <br />
                  <a
                    href="javascript:void(0)"
                    class="btn fr"
                    @click="toWhere('resumeMsgIndex',{showType:'position'})"
                  >查看更多</a>
                </ul>
              </div>
            </dd>
          </dl>

          <input type="hidden" value name="hasNextPage" id="hasNextPage" />
          <input type="hidden" value name="pageNo" id="pageNo" />
          <input type="hidden" value name="pageSize" id="pageSize" />
          <div id="flag"></div>
        </div>
        <!-- end .content_l -->

        <div class="content_r">
          <!-- end #Tags -->

          <dl
            class="c_section c_stages"
            style="display:flex;justify-content: center;margin-bottom:150px;"
          >
            <a href="javascript:void(0)">
              <div class="editmsg" @click="toWhere('editCompany',{type:'edit'})">编辑企业信息</div>
            </a>
          </dl>
          <dl class="c_section c_stages">
            <dt>
              <h2>
                <em></em>认证信息
              </h2>
            </dt>
            <dd>
              <div class="renzheng" v-if="company_principal.company.companyAuth">
                <img :src="company_principal.company.companyAuth.auth_image" class="img" />
              </div>
            </dd>
          </dl>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { CompanyMe, WorkerCompany } from "~/api/allRequest.js";
import "./../../../public/js/jquery.1.10.1.min.js";
import "./../../../public/js/jquery.lib.min.js";
import "./../../../public/js/search.min.js";
import "./../../../public/js/company.min.js";
import "./../../../public/js/home.min.js";
import "./../../../public/js/count.js";
import "./../../../public/js/core.min.js";
import "./../../../public/js/popup.min.js";

export default {
  name: "companyInfo",
  data() {
    return {
      scaleArr: ["10人以下", "10-20人", "20-50人", "50-100人", "100以上"],
      salary_unit: ["", "元/月", "元/日", "元/时"],
      educationArr: [
        "学历不限",
        "小学",
        "初中",
        "中专",
        "高中",
        "大学专科",
        "大学本科",
        "硕士",
        "博士",
        "博士后",
        "其它"
      ],
      company_auth: {},
      company_principal: {},
      company: {}
    };
  },
  components: {},
  beforeCreate() {},
  created() {
    this.$store.dispatch("changeTabName", "companyInfo");
  },
  beforeMount() {},
  mounted() {
    this.getCompanyInfo();
  },
  beforeUpdate() {},
  updated() {},
  beforeDestroy() {},
  destroy() {},
  methods: {
    getCompanyInfo() {
      this.$loading("加载中");
      CompanyMe()
        .then(result => {
          let { company_auth, company_principal } = result;
          this.company_auth = company_auth;
          this.company_principal = company_principal;
          WorkerCompany({ company_id: localStorage.getItem("company") })
            .then(result => {
              this.company = result;
              this.$loading.close();
            })
            .catch(err => {
              this.$loading.close();
              console.log(err);
            });
        })
        .catch(err => {
          this.$loading.close();
          console.log(err);
        });
    },
    toWhere(name, json) {
      if (json) {
        this.$router.push({ name, params: json });
      } else {
        this.$router.push({ name });
      }
    }
  }
};
</script>

<style scoped lang="less">
@import "./../../../public/less/main.less";
.companyInfo {
  .environment {
    width: 100%;
    height: 100%;
    z-index: 1;
    .swiperItem {
      display: flex;
      justify-content: center;
    }
    .el-carousel {
      width: 100%;
      height: 100%;
    }

    .el-carousel__item h3 {
      color: #475669;
      font-size: 18px;
      opacity: 0.75;
      // line-height: 200px;
      margin: 0;
    }

    .el-carousel__item:nth-child(2n) {
      background-color: #99a9bf;
    }

    .el-carousel__item:nth-child(2n + 1) {
      background-color: #d3dce6;
    }
  }

  .renzheng {
    width: 250px;
    height: 150px;
    .img {
      width: 100%;
      height: 100%;
    }
  }
  .editmsg {
    width: 150px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    background: #91cebe;
    border-radius: 5px;
  }
}
</style>
